{#
 This Source Code Form is subject to the terms of the Mozilla Public
 License, v. 2.0. If a copy of the MPL was not distributed with this
 file, You can obtain one at https://mozilla.org/MPL/2.0/.
#}

{% from "macros-protocol.html" import callout with context %}

{% extends "firefox/welcome/base.html" %}

{% block page_title %}Changez votre localisation, sécurisez votre connexion, protégez votre vie privée{% endblock %}

{% block page_image %}{{ static('img/products/vpn/common/social-share.png') }}{% endblock %}

{% block body_class %}welcome-page9{% endblock %}

{% set _entrypoint = 'mozilla.org-firefox-welcome-9' %}
{% set _utm_campaign = 'welcome-9-vpn' %}
{% set _source = '?source=welcome9' %}

{% block shoulder_cta %}{% endblock %}

{% block page_css %}
 {{ super() }}
 {{ css_bundle('protocol-callout') }}
{% endblock %}


{% block content_intro %}
  <img class="product-logo" src="{{ static('protocol/img/logos/mozilla/vpn/logo-flat.svg') }}" width="65" alt="Mozilla VPN">

  {% call callout(
    title='Changez votre localisation, sécurisez votre connexion, <strong>protégez votre vie privée</strong>.'|safe,
    desc='Mozilla VPN (Virtual Private Network) protège l’intégralité de votre connexion Internet - sur n’importe quel appareil et peu importe où vous naviguez en ligne.',
    class='mzp-t-firefox mzp-t-hero',
    include_cta=True,
    heading_level=1
  ) %}

  <p class="mzp-c-callout-desc">Rapide, fiable et ultra sécurisé avec une garantie de remboursement de 30 jours.</p>

  <p class="primary-cta">
    <a href="{{ url('products.vpn.landing') }}{{ _source }}" class="mzp-c-button mzp-t-product mzp-t-xl" data-cta-text="Get Mozilla VPN" >Installer Mozilla VPN</a>
  </p>
  {% endcall %}
{% endblock %}

{% block content_body %}
<section class="page-body">
  <div class="mzp-l-content">

    <div class="l-columns-two">

      <div class="c-picto-block">
        <div class="c-picto-block-image">
          <img src="{{ static('img/firefox/welcome/page9/illo-vpn-speed.svg') }}" alt="">
        </div>
        <h3 class="c-picto-block-title">Connexion rapide</h3>
        <div class="c-picto-block-body">
          <p>Nos serveurs sont alimentés par le protocole WireGuard® dans plus de 30 pays et conçus pour la vitesse. Vous pouvez donc streamer, télécharger et jouer comme vous en avez l’habitude.</p>
        </div>
      </div>

      <div class="c-picto-block">
        <div class="c-picto-block-image">
          <img src="{{ static('img/firefox/welcome/page9/illo-vpn-lock.svg') }}" alt="">
        </div>
        <h3 class="c-picto-block-title">Sûr de chez sûr</h3>
        <div class="c-picto-block-body">
          <p>Nous chiffrons votre activité réseau et masquons votre adresse IP. Nous ne conservons aucune sorte d’historique et ne partageons jamais les données de votre réseau avec d’autres.</p>
        </div>
      </div>
    </div>
  </div>
</section>
{% endblock %}

{% block content_utility %}
<p>
  <strong>
    <a href="https://support.mozilla.org/kb/firefox-browser-welcome-pages/?utm_source={{ _entrypoint }}&utm_medium=referral&utm_campaign={{ _utm_campaign }}&entrypoint={{ _entrypoint }}">
      Pourquoi cette page s’affiche-t-elle ?
    </a>
  </strong>
</p>
{% endblock %}
